<template>
  <div>
    <puplic-modal
      width="1400px"
      :publicVisible="publicVisible"
      modalStyle="addEditSupportModal"
      @cancel="cancel"
      :title="title"
    >
      <div slot="content" class="content">
        <div class="search-group">
          <div class="input-wrap">
            <div class="label">文书名称:</div>
            <div class="input-item">
              <a-input :maxLength="30" clearable v-model="queryParam.documentName" placeholder="请输入文书名称" />
            </div>
          </div>

          <div class="input-wrap">
            <div class="label">签署时间:</div>
            <div class="time-item">
              <start-end-time
                :times="times"
                :showTime="{ format: 'HH:mm:ss' }"
                format="YYYY-MM-DD HH:mm:ss"
                @timeChange="timeChange"
                :resetTime="resetTime"
              ></start-end-time>
            </div>
          </div>

          <div class="btn-wrap">
            <a-button class="searchBtn" @click="searchQuery(queryParam.startTime, queryParam.endTime)" type="primary">
              搜索
            </a-button>
            <a-button class="resetBtn" @click="searchReset()" type="primary"> 重置 </a-button>
          </div>
        </div>
        <div class="f1">
          <a-table
            rowKey="id"
            class="tableList"
            :columns="columns"
            :dataSource="dataSource"
            :pagination="ipagination"
            @change="handleTableChange"
          >
            <template #action="records">
              <span class="operation deatil-color" @click="jumpPreview(records)">预览</span>

              <span class="operation deatil-color" @click="jumpPreview(records)">下载</span>
            </template>
          </a-table>
        </div>
      </div>
      <div slot="footer"></div>
    </puplic-modal>
  </div>
</template>
<script>
import puplicModal from '@/components/publicModal'
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import startEndTime from '@/components/startEndTime'
export default {
  components: { puplicModal, startEndTime },
  mixins: [JeecgListMixin],
  name: 'addEditSupportModal',
  data() {
    return {
      url: {
        list: '/sys/document_company/company_sign_page',
      },
      title: '责任书列表',
      publicVisible: false,
      disableMixinCreated: true,
      queryParam: {},
      columns: [
        {
          title: '序号',
          align: 'center',
          width: 100,
          customRender: function (t, r, index) {
            return parseInt(index) + 1
          },
        },
        {
          title: '文书名称',
          dataIndex: 'documentName',
          ellipsis: true,
          align: 'center',
        },
        {
          title: '版本号',
          dataIndex: 'versionName',
          ellipsis: true,
          align: 'center',
        },
        {
          title: '发布时间',
          dataIndex: 'releaseTime',
          ellipsis: true,
          align: 'center',
        },
        {
          title: '签署时间',
          dataIndex: 'createTime',
          ellipsis: true,
          align: 'center',
        },
        {
          title: '操作',
          scopedSlots: { customRender: 'action' },
          ellipsis: true,
          align: 'center',
        },
      ],
    }
  },
  methods: {
    timeChange(v, index) {
      if (index == 1) {
        this.queryParam.startTime = this.$moment(v).valueOf()
      } else {
        this.queryParam.endTime = this.$moment(v).valueOf()
      }
      if (v == null) {
        this.queryParam.startTime = null
        this.queryParam.endTime = null
      }
    },

    show(records) {
      this.queryParam.companyId = records.id
      this.searchQuery()
      this.publicVisible = true
    },

    searchReset() {
      const { companyId } = this.queryParam
      this.queryParam = {}
      this.queryParam = { companyId }
      this.resetTime = true
      this.searchQuery()
    },

    jumpPreview(records) {
      this.$router.push({ path: '/officialDocManagement/preview', query: records })
    },

    cancel() {
      this.publicVisible = false
    },
  },
}
</script>
<style scoped lang="less">
@import '~@/assets/less/common.less';

/deep/ .content {
  padding: 20px;
}

/deep/ .modalFooter {
  height: 0 !important;
}

/deep/ .ant-table-row-cell-ellipsis {
  cursor: pointer;
}

.search-group {
  padding: 0;
}
</style>
